{% extends "base.html" %}
{% load treemenu_tags %}
{% load staticfiles %}

{% block page_specific_media %}
    {{ cuts_form.media }}
    <script src="{% static "js/echarts/echarts.min.js" %}"></script>
    <script src="{% static "js/echarts/macarons.js" %}"></script>
{% endblock %}

{% block page_inline_scripts %}
    <script type="text/javascript">
        function getCookie(name) {
            var cookieValue = null;
            if (document.cookie && document.cookie != '') {
                var cookies = document.cookie.split(';');
                for (var i = 0; i < cookies.length; i++) {
                    var cookie = jQuery.trim(cookies[i]);
                    // Does this cookie string begin with the name we want?
                    if (cookie.substring(0, name.length + 1) == (name + '=')) {
                        cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
                        break;
                    }
                }
            }
            return cookieValue;
        }

        var csrftoken = getCookie('csrftoken');

        function csrfSafeMethod(method) {
            // these HTTP methods do not require CSRF protection
            return (/^(GET|HEAD|OPTIONS|TRACE)$/.test(method));
        }

        jQuery.ajaxSetup({
            beforeSend: function(xhr, settings) {
                if (!csrfSafeMethod(settings.type) && !this.crossDomain) {
                    xhr.setRequestHeader("X-CSRFToken", csrftoken);
                };
            }
        });

        function form_submit()
        {
            jQuery.ajax({
                type: "POST",
                url: '#',
                data: $('#cuts_form').serialize(),
                contentType: "application/json",
                success: function(result){
                    document.getElementById("report").innerHTML = result;
                }
            });
        };

        function get_cubeship_config(cubeship_id) {
            var config = {};
            jQuery.ajax({
                type: "GET",
                url: "/report/{{ report.pk }}/cubeship/" + cubeship_id + "/",
                timeout: 9000,
                data: {},
                contentType: "application/json",
                async: false,
                success: function(result){
                    config = result["chart"];
                }
            });
            return config;
        }

    </script>
{% endblock %}

{% block topbar %}
    {% show_top_menu 1 %}
{% endblock %}

{% block sidebar %}
    {% show_side_menu theme_id True report.menuitem.pk %}
{% endblock %}

{% block content %}
<div class="main-content">
    <div class="page-content">
        <div class="page-header">
            <form id="cuts_form" method="post">
                <div style="display:table-cell">
                    {{ cuts_form }}
                </div>
                <div style="display:table-cell;padding-left: 10px">
                    <button id='submit' type="submit" class="btn btn-sm btn-success" onclick="form_submit()">
                        <i class="ace-icon fa fa-arrow-left icon-on-left bigger-110"></i>
                        提  交
                    </button>
                </div>
            </form>
        </div>
        <div class="row">
            <div id="report" class="col-xs-12">
                {% include "report/cubeships.html" %}
            </div>
        </div>
    </div>
</div>
{% endblock %}

{% block footer %}
{% endblock %}
